feat: add EditorConfig, VS Code settings & extension recommendations for consistent DX by karanpatill · Pull Request #748 · accordproject/template-playground

karanpatill · 2026-02-24T18:44:28Z

feat(dx): add EditorConfig and VS Code workspace configuration

Closes #628

This PR improves the developer experience by adding shared editor configuration files that ensure consistent formatting and a productive development environment across contributors — without affecting runtime behavior.

Changes

.editorconfig — Editor-agnostic formatting rules (2-space indentation, LF line endings, UTF-8 charset) with targeted overrides for Markdown, Makefiles, CI workflows, and minified files.
.vscode/extensions.json — Recommends 14 extensions mapped to the project's actual tech stack:
- Core: EditorConfig, Prettier, ESLint
- Frameworks: TypeScript Nightly, Tailwind CSS IntelliSense, Styled Components
- Testing: Playwright, Vitest Explorer
- Quality-of-Life: Spell Checker, PostCSS, Pretty TS Errors, dotenv
.vscode/settings.json — Project-level workspace settings:
- Format-on-save with Prettier
- Auto-fix ESLint errors on save
- Workspace TypeScript SDK resolution
- Tailwind IntelliSense for TSX files
- Smart search/file exclusions (node_modules, dist, package-lock.json, playwright-report)
- Markdown-specific overrides (word wrap, preserve trailing whitespace)
.gitignore — Updated to track .vscode/settings.json alongside the already-tracked extensions.json

Flags

Developer-experience only change
No impact on application logic, build, or runtime behavior
All files are non-intrusive and act as guidance for contributors

Why this is needed

Contributors using different editors and personal configurations can introduce inconsistent formatting, whitespace issues, and unnecessary diffs in pull requests. These files provide a shared baseline that:

Reduces formatting noise in PRs
Speeds up onboarding — new contributors get a productive VS Code setup instantly
Aligns with the existing codebase — all rules were derived from the project's actual .eslintrc.cjs, tsconfig.json, and source file conventions

Screenshots or Video

Not applicable (config files only)

Related Issues

Closes feature: add EditorConfig and VS Code recommendations for consistent DX #628

Signed-off-by: karanpatill <karanpatil82005@gmail.com>

…ignore to include them. Signed-off-by: karanpatill <karanpatil82005@gmail.com>

netlify · 2026-02-24T18:44:33Z

✅ Deploy Preview for ap-template-playground ready!

Name	Link
🔨 Latest commit	`29f8ddb`
🔍 Latest deploy log	https://app.netlify.com/projects/ap-template-playground/deploys/699f5644a025ce00078c0583
😎 Deploy Preview	https://deploy-preview-748--ap-template-playground.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

mttrbrts

Can you validate these changes against the setting in https://github.com/accordproject/concerto, we should strive to be consistent where possible?

Copilot

Pull request overview

This PR enhances the developer experience by introducing standardized editor configurations and comprehensive architecture documentation. The changes establish a consistent formatting baseline across contributors without affecting runtime behavior or build processes.

Changes:

Added .editorconfig with editor-agnostic formatting rules (2-space indentation, LF line endings, UTF-8) and targeted overrides for various file types
Added .vscode/settings.json with workspace-level configurations for formatting, TypeScript, Tailwind, and ESLint integration
Added .vscode/extensions.json recommending 14 VS Code extensions aligned with the project's tech stack
Updated .gitignore to track .vscode/settings.json alongside the existing .vscode/extensions.json
Added comprehensive ARCHITECTURE.md documentation explaining the template execution pipeline, state management, and component architecture

Reviewed changes

Copilot reviewed 4 out of 5 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
`.editorconfig`	Defines editor-agnostic formatting rules with 2-space indentation, LF line endings, and file-type-specific overrides
`.vscode/settings.json`	Configures format-on-save, ESLint auto-fix, TypeScript SDK, Tailwind IntelliSense, and search exclusions
`.vscode/extensions.json`	Recommends 14 VS Code extensions covering formatting (EditorConfig, Prettier, ESLint), frameworks (TypeScript, Tailwind, Styled Components), testing (Playwright, Vitest), and QoL tools
`.gitignore`	Updated to track `.vscode/settings.json` (line 18) for shared workspace settings
`ARCHITECTURE.md`	New 367-line comprehensive guide covering data flow, execution pipeline, state management, component architecture, and key libraries

Copilot · 2026-02-25T20:11:00Z

ARCHITECTURE.md

+export const NAME     = "Hello World";
+export const MODEL    = `namespace org.example.helloworld...`;   // Concerto .cto
+export const TEMPLATE = `Hello {{firstName}} {{lastName}}!`;     // TemplateMark
+export const DATA     = { firstName: "John", lastName: "Doe" }; // JSON


The documentation shows DATA as a JSON string in the example (line 150), but the actual Sample type definition in src/samples/index.ts specifies DATA as type "object", not string. The example should show DATA as an object literal without quotes, like: DATA = { firstName: "John", lastName: "Doe" }

Copilot · 2026-02-25T20:11:01Z

ARCHITECTURE.md

+└── MainContainer.tsx          ← Main split-panel workspace
+    ├── [Left PanelGroup — vertical]
+    │   ├── TemplateModel      ← Concerto .cto editor (ConcertoEditor.tsx)
+    │   │     └── ConcertoEditor.tsx   (Monaco editor, language: "cto")


The documentation states the Monaco editor language is "cto" for the Concerto Model Editor, but the actual implementation in src/editors/ConcertoEditor.tsx uses language="concerto". This should be corrected to match the implementation.

Suggested change

│ │ └── ConcertoEditor.tsx (Monaco editor, language: "cto")

│ │ └── ConcertoEditor.tsx (Monaco editor, language: "concerto")

Copilot · 2026-02-25T20:11:01Z

.editorconfig

+# ── Source files (JS / TS / JSX / TSX) ──────────────────────────────
+[*.{js,jsx,ts,tsx}]
+indent_size = 2
+max_line_length = 100


The max_line_length setting is set to 100 for JavaScript/TypeScript files, but there's no existing ESLint or Prettier configuration in the repository that enforces this limit. This could create confusion if the EditorConfig suggests one line length but no other tooling enforces it. Consider either removing this setting or adding a corresponding ESLint rule (e.g., max-len) or Prettier's printWidth configuration.

Suggested change

max_line_length = 100

Copilot · 2026-02-25T20:11:01Z

.vscode/settings.json

+{
+    // ── Editor Defaults ────────────────────────────────────────────
+    "editor.formatOnSave": true,
+    "editor.defaultFormatter": "esbenp.prettier-vscode",


The VS Code settings reference Prettier as the default formatter ("esbenp.prettier-vscode"), but Prettier is not listed as a dev dependency in package.json. Contributors who install the recommended extensions will have the Prettier extension, but the project should include a local Prettier installation to ensure consistent formatting across environments and CI/CD pipelines. Consider adding "prettier" to devDependencies and creating a .prettierrc configuration file to explicitly define formatting rules.

Copilot · 2026-02-25T20:11:02Z

ARCHITECTURE.md

+│   │   ├── index.ts          # Exports SAMPLES array + Sample type
+│   │   ├── playground.ts     # Default "playground" sample
+│   │   ├── helloworld.ts
+│   │   └── ...               # (14 more samples)


The comment states there are "14 more samples" (line 52), but based on the actual count in src/samples/, there are 17 total sample files including playground.ts and helloworld.ts (which are mentioned on lines 50-51). This should state "15 more samples" to be accurate.

Suggested change

│ │ └── ... # (14 more samples)

│ │ └── ... # (15 more samples)

karanpatill added 2 commits February 19, 2026 11:18

docs: add comprehensive architecture overview for Template Playground

58586a1

Signed-off-by: karanpatill <karanpatil82005@gmail.com>

feat: Add .editorconfig and VS Code workspace settings, updating .git…

f72f61b

…ignore to include them. Signed-off-by: karanpatill <karanpatil82005@gmail.com>

karanpatill requested a review from a team as a code owner February 24, 2026 18:44

Merge branch 'main' into feat/editorconfig-vscode-dx

29f8ddb

mttrbrts requested a review from Copilot February 25, 2026 20:07

Copilot started reviewing on behalf of mttrbrts February 25, 2026 20:08 View session

mttrbrts reviewed Feb 25, 2026

View reviewed changes

Copilot AI reviewed Feb 25, 2026

View reviewed changes

github-actions bot mentioned this pull request Mar 4, 2026

Monthly issue metrics report accordproject/.github#1

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: add EditorConfig, VS Code settings & extension recommendations for consistent DX#748

feat: add EditorConfig, VS Code settings & extension recommendations for consistent DX#748
karanpatill wants to merge 3 commits intoaccordproject:mainfrom
karanpatill:feat/editorconfig-vscode-dx

karanpatill commented Feb 24, 2026

Uh oh!

netlify bot commented Feb 24, 2026 •

edited

Loading

Uh oh!

mttrbrts left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Feb 25, 2026

Uh oh!

Copilot AI Feb 25, 2026

Uh oh!

Copilot AI Feb 25, 2026

Uh oh!

Copilot AI Feb 25, 2026

Uh oh!

Copilot AI Feb 25, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

	│ │ └── ConcertoEditor.tsx (Monaco editor, language: "cto")
	│ │ └── ConcertoEditor.tsx (Monaco editor, language: "concerto")

	│ │ └── ... # (14 more samples)
	│ │ └── ... # (15 more samples)

Uh oh!

Conversation

karanpatill commented Feb 24, 2026

feat(dx): add EditorConfig and VS Code workspace configuration

Changes

Flags

Why this is needed

Screenshots or Video

Related Issues

Uh oh!

netlify bot commented Feb 24, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for ap-template-playground ready!

Uh oh!

mttrbrts left a comment

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

netlify bot commented Feb 24, 2026 •

edited

Loading